<include file="public@header" />
</head>
<body>
<style>
	.column{width:120px; }
	.column_num{width:150px;}
</style>
	<div class="wrap">
		<ul class="nav nav-tabs">
        	<li><a href="{:url('cemetery/index')}">{:lang('ADMIN_CEMETERY_INDEX')}</a></li>
			<li><a href="{:url('cemetery/add')}">{:lang('ADMIN_CEMETERY_ADD')}</a></li>
			<li><a href="{:url('tombarea/index',array('parentid'=>$parentid,'id'=>$id))}">{:lang('ADMIN_TOMBAREA_INDEX')}</a></li>
			<li class="active"><a href="{:url('tombarea/add',array('parentid'=>$parentid,'id'=>$id))}">{:lang('ADMIN_TOMBAREA_ADD')}</a></li>
		</ul>
		<form method="post" class="form-horizontal js-ajax-form" action="{:url('Tombarea/add')}">
			<fieldset>
				<input type="hidden" name="tm[parentid]" value="{$parentid}">
				<input type="hidden" name="tm[id]" value="{$id}">
				<div class="control-group">
					<label class="control-label">位置:</label>
					<div class="controls">
                        <select name="tm[cemetery_id]" class="form-control">
							{$select_categorys}
						</select>
						<span class="form-required">*</span>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">名称:</label>
					<div class="controls">
						<input name="tm[name]" class="form-control" type="text">
						<span class="form-required">*</span>
					</div>
				</div>
                <div class="control-group">
					<label class="control-label">类型:</label>
					<div class="controls">
						<select name="tm[cate_id]" class="form-control">
							<option value="1">商品墓</option>
							<option value="2">艺术墓</option>
							<option value="3">生态墓</option>
                            <option value="4">节地墓</option>
						</select>
						<span class="form-required">*</span>
					</div>
				</div>
				<input type="hidden" name="tm[align]" value="1">
                <!--<div class="control-group">-->
					<!--<label class="control-label">对齐:</label>-->
					<!--<div class="controls">-->
						<!--<select name="align" class="form-control">-->
							<!--<option value="1">左起</option>-->
							<!--<option value="2">右起</option>-->
						<!--</select>-->
						<!--<span class="form-required">*</span>-->
					<!--</div>-->
				<!--</div>-->
				<div class="control-group">
					<label class="control-label">分布:</label>
					<div class="controls">
                        <input name="tm[row]" id="row" class="form-control" style=" width:100px; "  type="number" min="1">排
						<!--<select name="tm[row]" class="form-control">
							<for start="1" end="35" step="1" >
								<option value="{$i}">{$i}</option>
							</for>
						</select>-->
                        <button class="btn btn-primary btn-small js-ajax-submit addtr_row" type="button" name="addtr" style="margin-left:10px">生成</button>
					</div>
				</div>
                <div class="control-group">
					<label class="control-label">状态:</label>
					<div class="controls">
						<select name="tm[status]" class="form-control">
							<option value="1">显示</option>
							<option value="0">隐藏</option>
						</select>
					</div>
				</div>
                <div class="control-group">
					<label class="control-label">排序:</label>
					<div class="controls">
						<input name="tm[list_order]" id="list_order" class="form-control" style=" width:100px; "  type="number" value="100">
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">备注:</label>
					<div class="controls">
						<textarea name="tm[remark]" class="form-control" rows="5" cols="57" style="width: 500px;"></textarea>
					</div>
				</div>
			</fieldset>
            <div id="table" style=" overflow:auto"> </div>
			<div class="form-actions">
				<button type="submit" class="btn btn-primary type js-ajax-submit">{:lang('ADD')}</button>
				<a class="btn btn-default" href="javascript:history.back(-1);">{:lang('BACK')}</a>
			</div>
		</form>
	</div>
	<script type="text/javascript" src="__STATIC__/js/admin.js?v={:time()}"></script>
	<script type="text/javascript" src="__STATIC__/js/layer/layer.js"></script>
    <script type="application/javascript">
		//插入排
		$(".addtr_row").on("click",function(){
		   //获取排数
		   var pai = $(this).prev("#row").val();
		   console.log(pai)
		   //在表格中生成N排
		   var str1="";
		   for (var i=0;i<pai;i++){
			   str1 +="<div style='margin:10px 0'>"+
                	"<input type='text' class='form-control num' id='num_"+i+"' name='row["+i+"][num]' placeholder='墓位排号' style='width:100px; margin-right:5px' >排"+
                    "<input type='number' class='form-control column' id='column_"+i+"'  name='row["+i+"][column]' >位"+
                    "<button class='btn btn-primary btn-small   addtd_col' type='button' data-key='"+i+"' style='margin-left:10px'>生成</button> " +
					   "编号前7位：<input type='text' class='form-control ' id='txtBegin_"+i+"' placeholder='编号前7位' style='width: 160px;' >"+
					   "后2位序号：<input type='number' class='form-control ' id='numBegin_"+i+"'  style='width: 90px;' value='1' min='1'  >~ " +
					   "<input type='number' class='form-control ' id='numEnd_"+i+"' style='width: 100px;'value='10' max='99'  >" +
					   "<label><input type='radio' name='al_"+i+"' value='1'  checked /> 正序</label>\n" +
					   "<label><input type='radio' name='al_"+i+"'  value='0'  /> 倒序</label>"+
                    "<button class='btn btn-primary btn-small   run_num ' type='button' data-key='"+i+"' name='addtd_del' style='margin-left:10px' title=''>生成序号</button>"+
                "</div>"+
                "<div id='col_"+i+"'></div>";
		   }
		   $("#table").empty().append(str1);
		});

		//插入位
		$(document).on("click",".addtd_col",function(){
		   //获取位数
		   var paihao = $(this).prev(".column").prev(".num").val();
		   var key = $(this).data('key');
		   var wei = parseInt($(this).prev(".column").val());
		   if(!wei){
		       layer.msg("请输入位数信息");
		       return false;
		   }
		   //在表格中生成N位
		   var str_html_tr="<table class='table table-hover table-bordered table-list' style='width:auto; margin-right:5%;' id='table_col_"+key+"'><tr>";
		   for (var i=0;i<wei;i++){
			   var a = parseInt(i)+1;
			   str_html_tr +="<th style='width:120px'>" +
					   "<div>"+a+"</div>" +
					   "<input type='text' placeholder='墓位编号' id='column_num_"+i+"' name='row["+key+"][col]["+i+"][num]' value=''  maxlength='13' class='form-control column_num' />"+
					   "<select style='width:115px; margin-top:5px' class='form-control' name='row["+key+"][col]["+i+"][status]'><option value='1'>显示</option><option value='2'>隐藏</option></select>"
			   			"</th>";
		   }
			str_html_tr +='</tr></table>';
		   $('#col_'+key).empty().append(str_html_tr)
		});
		//插入位 墓位编号 减
		$(document).on("click",".run_num",function(){
			var key = $(this).data('key'), arr_num = [], txtBegin = $('#txtBegin_'+key).val(),
			numBegin = parseInt($('#numBegin_'+key).val()),
			numEnd = parseInt($('#numEnd_'+key).val()), al_radio= parseInt($('input:radio[name="al_'+key+'"]:checked').val());
			if (al_radio==1) {
				for (var i=numBegin; i<numEnd+1; i++) {
					var s = '' + i,s = (new Array( 2 - s.length + 1 ).join('0')) + s,str_num = txtBegin + s ;
					arr_num.push(str_num);
				}
			}else {
				for(var i=numEnd;i>=numBegin;i--){
					var s = '' + i,s = (new Array( 2 - s.length + 1 ).join('0')) + s,str_num = txtBegin + s ;
					arr_num.push(str_num);
				}
			}
			$('#table_col_'+key+'').find('tbody tr th ').each(function  (i, n) {
				var column_num_id = $(this).children('input')[0].id;
				$(this).children('input').val(arr_num[i]);
				console.log(i)
				console.log(column_num_id)
			})
		})
	</script>
</body>
</html>
